﻿@page
@model ResourceModel
@{
    ViewData["title"] = "资源中心";
}

<h2>上传中心</h2>
<form enctype="multipart/form-data" method="post">
    <dl>
        <dd id="selectD">
            <a href="javascript:;" class="file btn btn-outline-info">选择文件
                <input asp-for="UploadFiles" type="file" name="files" multiple />
                <span asp-validation-for="UploadFiles"></span>
            </a>
        </dd>
        <dd id="uploadD">
            <input type="radio" asp-for="UploadToDownload" name="UploadToDownload" value="true" checked="checked">仅暂存（7天）</input><br />
            <input type="radio" asp-for="UploadToDownload" name="UploadToDownload" value="false">仅上传（后台可见）</input>
            <br /><br />
            <button class="LoadBtn btn btn-outline-primary">
                <span class="spinner-border spinner-border-sm"></span>
                <p>上传文件</p>
                <input asp-page-handler="Handler" type="submit" value="" />
            </button>
            <p class="showFileName" style="display: inline;">&nbsp&nbsp&nbsp&nbsp已选择0个文件</p>
        </dd>
    </dl>
    <input type="hidden" asp-for="_fileSizeLimit" id="SizeLimit" />
    <p id="Msg">@Model.Msg</p>
</form>
<hr />
<h2>下载中心</h2>
<table class="table">
    <thead>
        <tr>
            <th>
                文件名
            </th>
            <th>
                发布时间
            </th>
            <th>
                文件大小
            </th>
            <th>
                操作
            </th>
        </tr>
    </thead>
    <tbody>
    @foreach (var file in Model.DownloadFiles)
    {
        <tr>
            <th>
                @file.Name
            </th>
            <th>
                @file.LastModified.ToLocalTime().ToString("yyyy年MM月dd日 HH：mm")
            </th>
            <th>
                @((file.Length >> 20 > 0) ? $"{file.Length >> 20}MB" : 
                    ((file.Length >> 10 > 0) ? $"{file.Length >> 10}KB" : $"{file.Length}B"))
            </th>
            <th>
                <form method="post">
                    <input type="hidden" name="filename" value="@file.Name" />
                    <button type="submit" asp-page-handler="Download" class="btn btn-outline-warning">下载</button>&nbsp&nbsp
                    <button type="submit" asp-page-handler="Delete" class="btn btn-outline-danger">删除</button>
                </form>            
            </th>
        </tr>
    }
    </tbody>
</table>

@section Scripts
{
<script>
$("#uploadD").hide();

$(".file").on("change","input[type='file']",function(){
    let files = document.getElementsByClassName("file")[0].children.UploadFiles.files;
    $(".showFileName").html("已选择" + files.length + "个文件");
    let size = 0;
    for(i = 0; i < files.length; i++)
        size += files[i].size;
    if(size >= $("#SizeLimit").val())
    {
        if(($("#SizeLimit").val() >> 30) >= 1)
            $("#Msg").html("文件过大！最大为" + ($("#SizeLimit").val() >> 30) + "GB");
        else if(($("#SizeLimit").val() >> 20) >= 1)
            $("#Msg").html("文件过大！最大为" + ($("#SizeLimit").val() >> 20) + "MB");
        else if(($("#SizeLimit").val() >> 10) >= 1)
            $("#Msg").html("文件过大！最大为" + ($("#SizeLimit").val() >> 10) + "KB");
        else
            $("#Msg").html("文件过大！最大为" + ($("#SizeLimit").val()) + "B");
    }
    else
    {
        $("#selectD").hide();
        $("#uploadD").show();
    }
})

$(".LoadBtn").on("click", function(){
    $(".LoadBtn span").css("display", "inline-block");
    $(".LoadBtn p").text("上传中");
})
</script>
}
@section Style
{
<style>     
.file {
  position: relative;
  display: inline;
  overflow: hidden;
}

.file input {
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;
}

.LoadBtn {
  position: relative;
  display: inline;
  overflow: hidden;
}

.LoadBtn span {
  display: none;
}

.LoadBtn p {
  display: inline;
  margin: 0;
}

.LoadBtn input {
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;
}
</style>
}